import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

Item {
    id: io_Monitor_Input_Back
    width: 1820
    height: 910

    // Rectangle{
    //     anchors.fill: parent
    //     color: "blue"

    //     Text{
    //         anchors.centerIn: parent
    //         font.pixelSize: 50
    //         font.bold: true
    //         color: "white"
    //         text: qsTr("输入信号")
    //     }
    // }

    Row{
        anchors.top: io_Monitor_Input_Back.top
        anchors.left: io_Monitor_Input_Back.left
        // spacing: 1
        Rectangle{
            width: 90
            height: 40
            border.width: 1
            color: "#333333"
            // 数据字段（与标题对应）
            Text {
                text: qsTr("序号")  // 序号从1开始
                font.pixelSize: 20
                horizontalAlignment: Text.AlignCenter
                verticalAlignment: Text.AlignVCenter
                anchors.centerIn: parent
                color: "white"
            }
        }

        Rectangle{
            width: 200
            height: 40
            border.width: 1
            color: "#333333"
            Text {
                // width: 200
                text: qsTr("点位")
                font.pixelSize: 20
                horizontalAlignment: Text.AlignLeft
                verticalAlignment: Text.AlignVCenter
                anchors.centerIn: parent
                color: "white"
            }
        }
        Rectangle{
            width: 220
            height: 40
            border.width: 1
            color: "#333333"
            Text {
                // width: 220
                text: qsTr("信号")
                font.pixelSize: 20
                horizontalAlignment: Text.AlignLeft
                verticalAlignment: Text.AlignVCenter
                anchors.centerIn: parent
                color: "white"
            }
        }
        Rectangle{
            width: 300
            height: 40
            border.width: 1
            color: "#333333"
            Text {
                text: qsTr("名称")
                font.pixelSize: 20
                horizontalAlignment: Text.AlignLeft
                verticalAlignment: Text.AlignVCenter
                anchors.centerIn: parent
                color: "white"
            }
        }
        Rectangle{
            width: 100
            height: 40
            border.width: 1
            color: "#333333"
            Text {
                text: qsTr("极性")
                font.pixelSize: 20
                horizontalAlignment: Text.AlignCenter
                verticalAlignment: Text.AlignVCenter
                anchors.centerIn: parent
                color: "white"
            }
        }
        Rectangle{
            width: 904
            height: 40
            border.width: 1
            color: "#333333"
            Text {
                // 模拟描述（长文本）
                text: qsTr("描  述")
                font.pixelSize: 20
                horizontalAlignment: Text.AlignLeft
                verticalAlignment: Text.AlignVCenter
                elide: Text.ElideRight  // 文本过长时省略（或设置wrapMode: Text.WordWrap换行）
                anchors.centerIn: parent
                color: "white"
            }
        }
    }

    Item{
        anchors.top: io_Monitor_Input_Back.top
        anchors.topMargin: 40
        anchors.left: io_Monitor_Input_Back.left
        width: 1820
        height: 870

        Rectangle {
            width: 1820
            height: 870
            clip: true
            color: "#f5f5f5"

            // 1. 核心滚动容器：Flickable（直接支持boundsBehavior）
            Flickable {
                id: flick
                anchors.fill: parent
                // 关闭水平滚动（内容宽度与容器一致）
                flickableDirection: Flickable.VerticalFlick
                // 关键：滚动到边界后停止，无弹性
                boundsBehavior: Flickable.StopAtBounds

                // 内容区域（与之前的Column一致）
                contentWidth: parent.width  // 宽度固定为容器宽
                Column {
                    id: contentColumn
                    width: flick.width
                    spacing: 1


                    //         // Row {
                    //         //     width: parent.width
                    //         //     height: 40
                    //         //     // 交替行背景色（增强可读性）
                    //         //     // color: index % 2 === 0 ? "#ffffff" : "#f0f0f0"

                    //         //     Rectangle{
                    //         //         width: 90
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         // 数据字段（与标题对应）
                    //         //         Text {
                    //         //             text: "1"  // 序号从1开始
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignCenter
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }

                    //         //     Rectangle{
                    //         //         width: 200
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         Text {
                    //         //             // width: 200
                    //         //             text: "P" + (1000 + 1)  // 模拟点位编码（如P1000、P1001...）
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignLeft
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }
                    //         //     Rectangle{
                    //         //         width: 220
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         Text {
                    //         //             // width: 220
                    //         //             text: "AI-4-20mA"  // 模拟信号类型
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignLeft
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }
                    //         //     Rectangle{
                    //         //         width: 300
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         Text {
                    //         //             text: "设备" + " 1 " + "传感器"  // 模拟名称
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignLeft
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }
                    //         //     Rectangle{
                    //         //         width: 100
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         Text {
                    //         //             text: "正"  // 模拟极性
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignCenter
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }
                    //         //     Rectangle{
                    //         //         width: 904
                    //         //         height: 43.5
                    //         //         border.width: 1
                    //         //         Text {
                    //         //             // 模拟描述（长文本）
                    //         //             text: "该设备用于检测环境参数，响应时间≤50ms，工作温度-20~70℃（第" + " 1 " + "条）"
                    //         //             font.pixelSize: 20
                    //         //             horizontalAlignment: Text.AlignLeft
                    //         //             verticalAlignment: Text.AlignVCenter
                    //         //             elide: Text.ElideRight  // 文本过长时省略（或设置wrapMode: Text.WordWrap换行）
                    //         //             anchors.centerIn: parent
                    //         //         }
                    //         //     }
                    //         // }

                    // 100条数据行（同上）
                    // 2. 100条数据行（用Repeater生成）
                    Repeater {
                        model: 100  // 生成100条数据

                        Row {
                            id: dataRow
                            width: parent.width
                            height: 40
                            Rectangle{
                                width: 90
                                height: 43.5
                                border.width: 1
                                // 数据字段（与标题对应）
                                Text {
                                    text: (index+1)  // 序号从1开始
                                    font.pixelSize: 20
                                    horizontalAlignment: Text.AlignCenter
                                    verticalAlignment: Text.AlignVCenter
                                    anchors.centerIn: parent
                                }
                            }

                            Rectangle{
                                width: 200
                                height: 43.5
                                border.width: 1
                                Text {
                                    // width: 200
                                    text: "P" + (1000 + index)  // 模拟点位编码（如P1000、P1001...）
                                    font.pixelSize: 20
                                    horizontalAlignment: Text.AlignLeft
                                    verticalAlignment: Text.AlignVCenter
                                    anchors.centerIn: parent
                                }
                            }
                            Rectangle{
                                width: 220
                                height: 43.5
                                border.width: 1
                                Text {
                                    // width: 220
                                    text: index % 2 === 0 ? "DI-24V" : "AI-4-20mA"  // 模拟信号类型
                                    font.pixelSize: 20
                                    horizontalAlignment: Text.AlignLeft
                                    verticalAlignment: Text.AlignVCenter
                                    anchors.centerIn: parent
                                }
                            }
                            Rectangle{
                                width: 300
                                height: 43.5
                                border.width: 1
                                Text {
                                    text: "设备" + (index+1) + "传感器"  // 模拟名称
                                    font.pixelSize: 20
                                    horizontalAlignment: Text.AlignLeft
                                    verticalAlignment: Text.AlignVCenter
                                    anchors.centerIn: parent
                                }
                            }
                            Rectangle{
                                width: 100
                                height: 43.5
                                border.width: 1
                                // Text {
                                //     text: index % 3 === 0 ? "正" : (index % 3 === 1 ? "负" : "无")  // 模拟极性
                                //     font.pixelSize: 20
                                //     horizontalAlignment: Text.AlignCenter
                                //     verticalAlignment: Text.AlignVCenter
                                //     anchors.centerIn: parent
                                // }

                                A_SwitchButton{
                                    anchors.centerIn: parent
                                    onText: qsTr("NO")
                                    offText: qsTr("NC")
                                    onToggled: function(checked){
                                        if(checked){
                                            console.log("第 "+(index+1)+" 当前状态: " + checked)
                                        }
                                        else
                                        {
                                            console.log("第 "+(index+1)+" 当前状态: " + checked)
                                        }
                                    }
                                }

                            }
                            Rectangle{
                                width: 904
                                height: 43.5
                                border.width: 1
                                Text {
                                    // 模拟描述（长文本）
                                    text: "该设备用于检测环境参数，响应时间≤50ms，工作温度-20~70℃（第" + " 1 " + "条）"
                                    font.pixelSize: 20
                                    horizontalAlignment: Text.AlignLeft
                                    verticalAlignment: Text.AlignVCenter
                                    elide: Text.ElideRight  // 文本过长时省略（或设置wrapMode: Text.WordWrap换行）
                                    anchors.centerIn: parent
                                }
                            }

                        }

                    }
                }

                // 内容高度自适应（确保Flickable能正确计算滚动范围）
                contentHeight: contentColumn.implicitHeight
                ScrollBar.vertical: ScrollBar {
                    anchors.right: parent.right
                    anchors.top: parent.top
                    anchors.bottom: parent.bottom
                    policy: ScrollBar.AsNeeded  // 内容超出时显示
                }
            }
        }
    }



}
